import { FC } from 'react'
import { Result, Button } from 'antd'
import { Link } from 'react-router-dom'
import styled from 'styled-components'


const NotFound: FC<any> = (props) => {
    return (
        <NotFoundPage>
            <Result
                status="404"
                title="404"
                subTitle="Sorry, the page you visited does not exist."
                extra={(
                    <Link to="/">
                        <Button type="primary">Back Home</Button>
                    </Link>
                )}
            />
        </NotFoundPage>
    )
}

const NotFoundPage = styled.div `
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    width: 100vw;
`

export default NotFound
